<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div id="box">我是一个盒子</div>
    <p id="para">我是一个段落</p>
    <script>
        //所谓的访问元素节点，就是指得到，获取页面上的元素节点
        //对节点进行操作，第一步就是要得到它
        //访问元素节点主要依靠document对象
        //document对象是DOM中最重要的东西，几乎所有的DOM的功能都封装在了document对象中
        //document对象也表示整个HTML文档，他是DOM节点树的根
        // docunment对象的nodeType属性值是9
        //document.nodeType为9

        //访问元素节点常用的方法：
        //docunebt.getElementById()          通过id得到元素
        //docunebt.getElemenstByTagName()    通过标签名得到元素数组
        //docunebt.getElementsByClassName()  通过类名得到元素组
        //docunebt.querySelector()           通过选择器得到元素        
        //docunebt.querySelectorAll()        通过选择器得到元素数组    
        //如果页面上有相同id的元素，则只能得到第一个!!!
        //不管元素藏得多深，都可以得到
        
        //docunebt.getElementById()         通过id得到元素
        var box=document.getElementById('box')
        var para=document.getElementById('para')
        console.log(box)//<div id="box">我是一个盒子</div>
        console.log(para)//<p id="para">我是一个段落</p>
        console.log(box.nodeType)//1
        console.log(typeof(box))//object
        
    </script>
</body>
</html>